<br>
<script type="text/javascript">
function goColor(){
	window.location.href = '?color='+document.getElementById('colorInput').value;
}
</script>
<table align="center">
	<tr>
		<td>
			Выбор цвета:
		</td>
		<td>
			<input 	name="color" type="text" class="form-control" 
					id="colorInput" placeholder="Код цвета #RRGGBB" autofocus="" 
					onkeydown="if (event.keyCode == 13) document.getElementById('btnGoColor').click()">
		</td>
		<td>
			<button class="btn btn-lg btn-primary btn-block" id="btnGoColor" onclick="goColor();">
                    Выбрать</button>
		</td>
		<td>
			<a href="?color=000000" title="Black icons" style="background-color: #000000;" class="speca">&nbsp;&nbsp;&nbsp;&nbsp;</a>
		</td>
		<td>
			<a href="?color=FF0000" title="Red icons" style="background-color: #FF0000;" class="speca">&nbsp;&nbsp;&nbsp;&nbsp;</a>
		</td>
		<td>
			<a href="?color=00FF00" title="Green icons" style="background-color: #00FF00;" class="speca">&nbsp;&nbsp;&nbsp;&nbsp;</a>
		</td>
		<td>
			<a href="?color=0000FF" title="Blue icons" style="background-color: #0000FF;" class="speca">&nbsp;&nbsp;&nbsp;&nbsp;</a>
		</td>
	</tr>
</table>
{% if icons %}
<table align="center">
	{% for row in icons %}
		<tr>
			{% for icn in row %}
				<td style="padding: 15px;" align="center">
					<a href="/viewIcon?icon={{icn.file}}&color=black">
						<img src="../static/{{icn.file}}" width="64" height="64">
					</a>
					 <br>
					{{icn.name}}
				</td>
			{% endfor %}
		</tr>
	{% endfor %}
</table>
<div align="center" style="margin-top:10px;">
страница {{ currPage }} из {{ allPages }}
</div>
<div align="center"><a href="?page={{ currPage|add:"-1" }}">Предыдущая</a> / <a href="?page={{ currPage|add:"1" }}">Следующая</a></div>
{% endif %}